<template>
  <view @click="openTencentMapNavigation" class="address color-333 flex-lect">
    <u-icon name="map" color="#999" size="36"></u-icon>
    <text class="ml10 mr10 flex-1 f28" style="margin-top: -6rpx;">{{detail.address}}</text>
    <u-icon name="arrow-right" color="#999" size="26"></u-icon>
  </view>
</template>

<script>
  export default {
    name: 'addressMap',
    props: {
      detail: {
        type: Object,
        default: null
      },
    },
    data() {
      return {
        
      };
    },
    methods: {
      openTencentMapNavigation() {
        // 假设目标位置经纬度，实际使用时需替换为真实的目标位置
        const latitude = Number(this.detail.lat || 22.5470); 
        const longitude = Number(this.detail.lng || 113.9519); 
        const name = this.detail.position;
        const address = this.detail.address;
        uni.openLocation({
          latitude,
          longitude,
          name,
          address,
          scale: 18,
          success: (res) => {
            console.log('打开地图成功', res);
          },
          fail: (err) => {
            console.error('打开地图失败', err);
          }
        });
      },
    }
  };
</script>

<style lang="scss" scoped>
  .address{background-color: #F3F3F3; border-radius: 20rpx; padding: 30rpx 20rpx;}
</style>